<template>
	<view style="overflow-y: auto;" v-if="dataOk">
		<scroll-view scroll-y="true" :class="isView ? '' : 'scroll-height'">
			<view class="condition">
				<view class="contexts">
					<view class="loca-select">
						<view class="conleft">{{$t('defect.common.locaName')}}<span class="redx">*</span></view>
						<view class="conright" v-if="!judgeBase">
							<button type="primary" size="mini" @click="scanLoca">{{$t('baseCommon.buttons.scan')}}</button>
							<button type="primary" size="mini" @click="nfcLoca">NFC</button>
						</view>
					</view>
					<view class="contopright">
						<textarea disabled v-model="data.locaName" :placeholder="$t('baseCommon.message.nfcOrScan')" auto-height />
					</view>
				</view>
			</view>
			<view class="condition">
				<view class="conmenus">
					<view class="conleft">{{$t('defect.common.defectLev')}}<span class="redx">*</span></view>
					<view class="conright">
						<data-picker v-model="data.dfLevelNo" :range="levelList" :disabled="judgeBase" @change="selectLevel"></data-picker>
					</view>
				</view>
				<view class="conmenus">
					<view class="conleft">{{$t('defect.defInfo.dfType')}}<span class="redx">*</span></view>
					<view class="conright">
						<data-picker v-model="data.dfType" :range="typeList" :disabled="judgeBase"></data-picker>
					</view>
				</view>
				<view class="conmenus">
					<view class="conleft">{{$t('baseCommon.other.skillNo')}}<span class="redx">*</span></view>
					<view class="conright">
						<data-picker v-model="data.skillNo" :range="skillList" :disabled="judgeBase"></data-picker>
					</view>
				</view>
				<view class="contexts">
					<view class="conleft">{{$t('defect.common.defectCom')}}<span class="redx">*</span></view>
					<view class="contopright">
						<textarea v-model="data.dfDesp" :placeholder="$t('baseCommon.message.pleaseEnter', { title: '' })" 
							auto-height :disabled="judgeBase" />
					</view>
				</view>
			</view>
			<view class="condition">
				<view class="conmenus">
					<view class="conleft shortleft">{{$t('defect.defInfo.findperson')}}<span class="redx">*</span></view>
					<view class="conright fieldSplice">
						<input disabled :placeholder="$t('baseCommon.message.pleaseSelect', { title: '' })" v-model="data.findperson" />
						<view class="separator">|</view>
						<view class="fieldView">{{data.findTeamName}}</view> 
					</view>
				</view>
				<view class="conmenus">
					<view class="conleft">{{$t('defect.defInfo.disTime')}}</view>
					<view class="conright">
						<date-picker mode="dateTime" :showValue="data.finddate" :disabled="judgeBase" @change="dateChange($event, 'finddate')">
							{{ data.finddate || $t('baseCommon.message.pleaseSelect', { title: '' }) }}
						</date-picker>
					</view>
				</view>
				<view class="conmenus">
					<view class="conleft">{{$t('defect.defInfo.planEndTime')}}<span class="redx">*</span></view>
					<view class="conright">
						<date-picker mode="dateTime" :showValue="data.planEndTime" :disabled="judgeBase" @change="dateChange($event, 'planEndTime')">
							{{ data.planEndTime || $t('baseCommon.message.pleaseSelect', { title: '' }) }}
						</date-picker>
					</view>
				</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	import { notice, utilities, business } from '@/utils/common.js'
	import { defect as constants } from '@/utils/business/constants.js'
	import * as sqliteUtil from '@/utils/sqlite.js'
	import * as sqliteDefect from '@/utils/business/defectSqlite.js'
	
	export default {
		props: {
			data: {
				type: Object,
				default() {
					return {}
				}
			},
			nfcData: {
				type: String
			},
			isView: {
				type: Boolean,
				default: false
			}
		},
		data() {
			return {
				dataOk: false,
				judgeBase: false, //判断基础信息是否禁用
				levelList: [],
				typeList: [],
				skillList: [],
				defectLevel: []
			}
		},
		mounted() {
			this.init()
		},
		watch: {
			nfcData: {
				handler(val) {
					this.handleNfc()
				},
				immediate: true
			}
		},
		methods: {
			async init() {
				// 缺陷等级
				await sqliteUtil.selectTableInfo('m_df_level').then(res=>{
					this.levelList = []
					// 下划线转驼峰
					utilities.formatHumpLineTransfer(res)
					this.defectLevel = res
					res.forEach(item=>{
						this.levelList.push({
							value: item.dfLevelNo,
							label: item.dfLevel
						})
					})
				})
				
				// 专业
				await sqliteUtil.selectTableInfo('m_cpis_cat_dic', 'type_key', 'zybm').then(res=>{
					this.skillList = []
					res.forEach(item=>{
						this.skillList.push({
							value: item.key,
							label: item.name
						})
					})
				})
				
				// 缺陷类型
				await sqliteUtil.selectTableInfo('m_cpis_cat_dic', 'type_key', 'qxlx').then(res=>{
					this.typeList = []
					res.forEach(item=>{
						this.typeList.push({
							value: item.key,
							label: item.name
						})
					})
				})
				
				// 判断基础信息是否禁用
				this.judgeBase = this.isView
				
				this.dataOk = true
			},
			dateChange(e, attr) {
				this.data[attr] = e
			},
			selectLevel(){
				let levelInfo = this.defectLevel.find(r => r.dfLevelNo === this.data.dfLevelNo)
				this.data.noticepersonId = levelInfo.notifierIds
				this.data.noticeperson = levelInfo.notifierNames
				this.data.planEndTime = utilities.getCalDateTime(this.data.finddate, levelInfo.timelimit)
			},
			scanLoca() {
				let that = this;
				uni.scanCode({
					onlyFromCamera: true,
					success: function (res) {
						let data = business.handleCode(res.result)
						that.data.locaId = data.scanId
						that.data.locaNo = data.scanNo
						that.data.locaName = data.scanName
					}
				});
			},
			nfcLoca() {
				notice.toast(this.$t('inspection.taskExecute.nfcRead'))
			},
			handleNfc() {
				if(this.nfcData) {
					let data = business.handleCode(this.nfcData)
					this.data.locaId = data.scanId
					this.data.locaNo = data.scanNo
					this.data.locaName = data.scanName
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import '@/static/style/common-detail.scss';
	
	.scroll-height {
		/* #ifdef APP-PLUS */
		height: calc(100vh - 110px);
		/* #endif*/
		/* #ifdef H5 */
		height: calc(100vh - 155px);
		/* #endif*/
	}
	
	.shortleft {
		width: 25%;
	}
	
	.fieldSplice {
		width: 75%;
		display: flex;
		align-items: center;
		justify-content: flex-end;
		
		.separator {
			margin: 0 5px;
		}
		
		.fieldView {
			line-height: 35px;
		}
	}
</style>
